<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>I learn</title>
  <link rel="stylesheet" href="./fa/css/all.min.css">
  <link rel="stylesheet" href="./css/mobile.css">
</head>
<body>
  
  <header class="top-bar">
    <div class="menu-btn">
      <a href="#">
        <i class="fas fa-stream"></i>
      </a>
    </div>
    <h1 class="logo">
      <a href="#">爱学习</a>
    </h1>
    <div class="search-btn">
      <a href="#">
        <i class="fas fa-search"></i>
      </a>
    </div>
  </header>

  <div class="banner w">
    <a href="#">
      <img src="./img/17/banner.png" alt="">
    </a>
  </div>

  <nav class="menu">
    <a class="course" href="#">
        <i class="fas fa-book"></i>
        我的课程
    </a>
    <a class="star" href="#">
        <i class="fas fa-cut"></i>
        明星讲师
    </a>
    <a class="sub" href="#">
        <i class="fas fa-envelope"></i>
        我的订阅
      </a>
    <a class="download" href="#">
        <i class="fas fa-globe"></i>
        我的下载
    </a>
  </nav>

  <div class="course-list">
    <div class="title">
      <h2>最新课程</h2>
      <a href="#">更多+</a>
    </div>
    <div class="item-list">
      <div class="item">
        <!-- 封面 -->
        <div class="cover">
            <img src="img/17/cover.png" alt="">
        </div>

        <!-- 小标题 -->
        <h3 class="course-title">
            摄影课程
        </h3>

        <!-- 用户信息 -->
        <div class="user-info">
            <div class="avatar">
                <img src="img/17/avatar.png" alt="">
            </div>
            <div class="nickname">
                令狐冲
            </div>
        </div>
      </div>
      <div class="item">
        <!-- 封面 -->
        <div class="cover">
            <img src="img/17/cover.png" alt="">
        </div>

        <!-- 小标题 -->
        <h3 class="course-title">
            摄影课程
        </h3>

        <!-- 用户信息 -->
        <div class="user-info">
            <div class="avatar">
                <img src="img/17/avatar.png" alt="">
            </div>
            <div class="nickname">
                令狐冲
            </div>
        </div>
      </div>
      <div class="item">
        <!-- 封面 -->
        <div class="cover">
            <img src="img/17/cover.png" alt="">
        </div>

        <!-- 小标题 -->
        <h3 class="course-title">
            摄影课程
        </h3>

        <!-- 用户信息 -->
        <div class="user-info">
            <div class="avatar">
                <img src="img/17/avatar.png" alt="">
            </div>
            <div class="nickname">
                令狐冲
            </div>
        </div>
      </div>
    </div>
  </div>

  <div class="course-list">
    <div class="title">
      <h2>最新课程</h2>
      <a href="#">更多+</a>
    </div>
    <div class="item-list">
      <div class="item">
        <!-- 封面 -->
        <div class="cover">
            <img src="img/17/cover.png" alt="">
        </div>

        <!-- 小标题 -->
        <h3 class="course-title">
            摄影课程
        </h3>

        <!-- 用户信息 -->
        <div class="user-info">
            <div class="avatar">
                <img src="img/17/avatar.png" alt="">
            </div>
            <div class="nickname">
                令狐冲
            </div>
        </div>
      </div>
      <div class="item">
        <!-- 封面 -->
        <div class="cover">
            <img src="img/17/cover.png" alt="">
        </div>

        <!-- 小标题 -->
        <h3 class="course-title">
            摄影课程
        </h3>

        <!-- 用户信息 -->
        <div class="user-info">
            <div class="avatar">
                <img src="img/17/avatar.png" alt="">
            </div>
            <div class="nickname">
                令狐冲
            </div>
        </div>
      </div>
      <div class="item">
        <!-- 封面 -->
        <div class="cover">
            <img src="img/17/cover.png" alt="">
        </div>

        <!-- 小标题 -->
        <h3 class="course-title">
            摄影课程
        </h3>

        <!-- 用户信息 -->
        <div class="user-info">
            <div class="avatar">
                <img src="img/17/avatar.png" alt="">
            </div>
            <div class="nickname">
                令狐冲
            </div>
        </div>
      </div>
    </div>
  </div>

</body>
</html>